<template>
  <div class="user_bind_elder">
    <aplid-base-crud ref="crud" v-bind="baseConfig">
      <template v-slot:DetailDialog="{ row, show }">
        <Detail @rechange="handleOperate" @refresh="handleRefresh" :api="baseConfig.api" v-if="show" :nowRowData="row">
        </Detail>
      </template>
      <template v-slot:editDialog="{ row, show }">
        <EditForm
          @rechange="handleOperate"
          @refresh="handleRefresh"
          :api="baseConfig.api"
          v-if="show"
          :nowRowData="row"
          >
        </EditForm>
      </template>
      <template v-slot:addDialog="{ row, show }">
        <AddForm
          @rechange="handleOperate"
          @refresh="handleRefresh"
          :api="baseConfig.api"
          v-if="show"
          :nowRowData="row"
          >
        </AddForm>
      </template>
    </aplid-base-crud>
  </div>
</template>

<script setup lang="ts">
import { baseConfig } from './config'
import EditForm from './Edit/index.vue'
import Detail from './Detail/index.vue'
import AddForm from './Add/index.vue'

const crud = ref()
const handleRefresh = () => {
  nextTick(() => {
    crud.value.refreshChange()
  })
}

const handleOperate = (type, row, title) => {
  nextTick(() => {
    crud.value.handleOperate(type, row, title)
  })
}
</script>

<style scoped lang="scss"></style>